import Taro, { Component } from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components'
import { observer, inject } from '@tarojs/mobx'
import { AtIcon } from 'taro-ui'
import './workbench.scss'


@inject('counterStore')
@observer
class Workbench extends Component {

  config = {
    navigationBarTitleText: 'ANT管理系统',
    navigationBarTextStyle: 'white',
    navigationBarBackgroundColor: '#1791ff',
  }
  constructor() {
    this.state = {
      test: '11111',
      // order: require('../../img/order.png')
    }
  }
  componentWillMount() {
    console.log('componentWillMount----');
  }

  componentWillReact() {
    console.log('componentWillReact')
  }

  componentDidMount() { }

  componentWillUnmount() { }

  componentDidShow() { }

  componentDidHide() { }

  increment = () => {
    const { counterStore } = this.props
    counterStore.increment()
  }

  decrement = () => {
    const { counterStore } = this.props
    counterStore.decrement()
  }

  incrementAsync = () => {
    const { counterStore } = this.props
    counterStore.incrementAsync()
  }

  render() {
    const { counterStore: { counter } } = this.props
    return (
      <View className='homePage-view'>
        <View className="pageBar">
        
          <View className="dataTitle">今日数据</View>
          <View className='dataList'>
            <View className="item">
              <View className="data">60</View>
              <View className="title">今日单量</View>
            </View>
            <View className="item">
              <View className="data">6000</View>
              <View className="title">交易金额</View>
            </View>
            <View className="item">
              <View className="data">200</View>
              <View className="title">浏览量</View>
            </View>
          </View>
        </View>
        <View className='menuList'>
          <View className="item">
             <View><AtIcon prefixClass='icon' value='dingdanguanli' size='28' color='#1791FF'></AtIcon></View> 
            <View className="name">订单管理</View>
          </View>
          <View className="item">
             <View><AtIcon prefixClass='icon' value='shouhuoguanli' size='28' color='#1791FF'></AtIcon></View>
            <View className="name">收货管理</View>
          </View>
          <View className="item">
             <View><AtIcon prefixClass='icon' value='shouhouguanli' size='28' color='#1791FF'></AtIcon></View> 
            <View className="name">售后管理</View>
          </View>
          <View className="item">
             <View><AtIcon prefixClass='icon' value='pintuanguanli' size='28' color='#1791FF'></AtIcon></View> 
            <View className="name">拼团管理</View>
          </View>
          <View className="item">
             <View><AtIcon prefixClass='icon' value='shujufenxi' size='28' color='#1791FF'></AtIcon></View> 
            <View className="name">数据分析</View>
          </View>
        </View>
        {/* <AtIcon prefixClass='icon' value='gerenzhanghu' size='30' color='#F00'></AtIcon> */}
      </View>
    )
  }
}

export default Workbench 
